<template name="list-item">
	<view class="listitem m1">
		<text class="title">{{text}}</text> <view class="right"><text v-if="showright">{{newtext}}</text><text class="icon"></text></view> 
	</view>
</template>

<script>
	export default {
		name:'list-item',
		props:['text','newtext','showright'],
	}
</script>

<style>
	.m1{margin-top: 1px;}
	.listitem{
		display: flex;
		justify-content: space-between;
		align-items: center; 
		background-color: #fff;
		padding: 36px 25px;
	}
	.listitem .title{
		font-size: 32px;
		color: #000;
	}
	.listitem .icon{
		width: 12px;
		height: 22px;
		background: url('') no-repeat center;
		background-size: 100%;
	}
	.right{
		display: flex;
		justify-content: flex-end;
		align-items: center;
	}
	.right text:nth-of-type(1){
		margin-right: 20px;
		color: #666;
		font-size: 32px;
	}
</style>
